/* eslint-disable no-empty */
<template>
  <page-card title="同步日志"
             :need-back="true">
    <a-form layout="inline">
      <a-row type="flex"
             style="margin-bottom:20px"
             justify="end">
        <a-col>
          <a-form-item style="float:center"
                       label="状态"
                       prop="resultCode">
            <a-select v-model="params.resultCode"
                      placeholder="请选择"
                      allowClear
                      style="width:100px">
              <a-select-option value="0">成功</a-select-option>
              <a-select-option value="1">失败</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
        <a-col>
          <a-form-item label="选择日期"
                       prop="time">
            <a-range-picker v-model="params.time"
                            format="YYYY-MM-DD HH:mm:ss"
                            show-time
                            type="date" />
          </a-form-item>
        </a-col>
        <a-col>
          <a-form-item class="unit-sync-log-formbar-btn">
            <a-button type="primary"
                      @click="search">查询</a-button>
          </a-form-item>
        </a-col>
      </a-row>
    </a-form>

    <a-table :pagination="pagination"
             @change="handleTableChange"
             ref="table"
             :rowKey="record => record.id"
             :data-source="dataSource"
             :columns="columns">
      <template slot="batchType"
                slot-scope="item,record">
        <span v-if="record.batchType === '1'">机构</span>
        <span v-else-if="record.batchType === '2'">用户</span>
      </template>
      <template slot="resultCode"
                slot-scope="item,record">
        <span v-if="record.resultCode === 0">成功</span>
        <span v-else>失败</span>
      </template>
      <template slot="syncType"
                slot-scope="item,record">
        <span v-if="record.syncType === '1'">新增</span>
        <span v-if="record.syncType === '2'">修改</span>
        <span v-if="record.syncType === '3'">删除</span>
        <span v-if="record.syncType === '4'">批量</span>
      </template>
      <template slot="operation"
                slot-scope="item,record">
        <a @click="download( record)">下载json</a>
      </template>
    </a-table>
  </page-card>
</template>

<script>
import { syncLogInfoPage } from '../../api/application'
import { PAGINATION } from '../../constants'
import moment from 'moment'
import 'moment/locale/zh-cn'
export default {
  data () {
    return {
      moment,
      pagination: PAGINATION,
      dataSource: [],
      params: {
        resultCode: undefined,
        time: [],
        mediaId: null,
        mediaType: null
      },
      columns: [
        {
          title: '名称',
          dataIndex: 'mediaName',
          align: 'center',
          width: '15%'
        },
        {
          title: '同步类型',
          dataIndex: 'batchType',
          align: 'center',
          scopedSlots: { customRender: 'batchType' },
          width: '90px'
        },
        {
          title: '同步应用',
          dataIndex: 'systemName',
          align: 'center',
          width: '20%'
        },
        {
          title: '同步地址',
          dataIndex: 'requestUrl',
          align: 'center',
          width: '20%'
        },
        {
          title: '同步状态',
          dataIndex: 'resultCode',
          align: 'center',
          width: '90px',
          scopedSlots: { customRender: 'resultCode' }
        },
        // {
        //   title: '操作类型',
        //   dataIndex: 'syncType',
        //   align: 'center',
        //   width: '90px',
        //   scopedSlots: { customRender: 'syncType' }
        // },
        {
          title: '同步结果',
          dataIndex: 'resultMessage',
          align: 'center'
        },
        {
          title: '同步时间',
          dataIndex: 'syncTime',
          align: 'center',
          width: '160px'
        },
        {
          title: '操作',
          dataIndex: 'operation',
          align: 'center',
          width: '90px',
          scopedSlots: { customRender: 'operation' }
        }
      ]
    }
  },
  activated () {
    this.params.mediaId = this.$route.query.mediaId
    this.params.mediaType = this.$route.query.mediaType
    this.load()
  },
  methods: {
    handleTableChange (pagination) {
      this.pagination = pagination
      this.pagination.currPage = this.pagination.current
      this.load()
    },

    search () {
      this.pagination.currPage = 1
      this.load()
    },
    load () {
      this.params.currPage = this.pagination.current
      this.params.pageSize = this.pagination.pageSize
      if (this.params.time.length > 0) {
        this.params.startTime = this.params.time[0]
        this.params.endTime = this.params.time[1]
      } else {
        this.params.startTime = null
        this.params.endTime = null
      }
      syncLogInfoPage(this.params).then(res => {
        this.dataSource = res.list
        this.pagination.current = res.currPage
        this.pagination.total = res.totalCount
      })
    },
    download (record) {
      const data = record.requestData
      const link = document.createElement('a')
      const blob = new Blob([data], { type: 'application/vnd.ms-excel;charset=GBK' })
      const objectUrl = URL.createObjectURL(blob) // 创建URL
      link.href = objectUrl
      link.download = record.mediaName + '-' + record.systemName + '-' + record.syncTime + '.txt' // 自定义文件名
      link.click() // 下载文件
      URL.revokeObjectURL(objectUrl) // 释放内存
    }
  }
}
</script>

<style lang="less">
.unit-sync-log-formbar-btn {
  margin-right: 0px !important;
}
</style>
